<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>1. 类的基本知识</title>
</head>

<body>
  <script type="text/javascript">
    // 创建一个 boy 类
    class Boy {
      // 构造器方法
      constructor(name, age) {
        // 构造器中的this是谁？ —— 类的实例对象
        this.name = name
        this.age = age
      }
      // 一般函数
      speak() {
        // speak 函数放在了那里？ —— 类的原型对象上；speak 是给谁用的？ —— 供实例使用
        console.log(`我叫${this.name}，我的年龄是 ${this.age} 岁`)
      }

    }
    // 创建一个 boy 实例对象
    const b1 = new Boy('我是ed.', 9)
    
    // console.log(b1)
    // b1.speak()

    // 创建一个 Student 类继承 Boy
    class Student extends Boy{
      // 构造器函数
      constructor(name, age, grade) {
        super(name, age) // 必须继承父类，且 super 必须在最开始
        this.grade = grade
      }
      // 重写父类方法
      speak() {
        // speak 函数放在了那里？ —— 类的原型对象上；speak 是给谁用的？ —— 供实例使用
        console.log(`我叫 ${this.name}，我的年龄是 ${this.age} 岁，我在上 ${this.grade}`)
      }
    }

    const s1 = new Student('我是ed.', 10, '三年级')

    console.log(s1)
    s1.speak()

    // /**
    //  * 总结：
    //  *  1.类中的构造器不是必须写的，要对实例进行一些初始化的操作，如添加指定属性才写。
    //  *  2.如果A类继承了B类，并且A类中写了构造器，那么A类构造器中的 super 必须要调用，且在第一时间调用。
    //  *  3.类中所定义的方法，都是放在了类的原型对象上，供实例去使用。 
    //  * /

  </script>
</body>

</html>